<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('添加数据源')"/>
</head>
<body>
    <form class="layui-form" action="" onsubmit="return false">
        <div class="mainBox">
            <div class="main-container">
                <div class="layui-form-item">
                    <label class="layui-form-label">连接名</label>
                    <div class="layui-input-block">
                        <input type="text" name="connectName" required  lay-verify="required" lay-affix="clear" value="本地MySQL"  placeholder="请输入连接名" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">数据库类型</label>
                    <div class="layui-input-block">
                        <select name="dbType" lay-verify="required" lay-filter="selected" lay-search>
                            <option value=""></option>
                            <option value="MySQL">MySQL</option>
                            <option value="Oracle">Oracle</option>
                            <option value="SQLServer">SQLServer</option>
                            <option value="PostgreSQL">PostgreSQL</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">连接地址</label>
                    <div class="layui-input-block">
                        <input type="text" name="connUrl" required  lay-verify="required" lay-affix="clear" placeholder="请输入连接地址"
                               value="jdbc:mysql://localhost:3306/fast?useUnicode=true&characterEncoding=UTF-8&serverTimezone=Asia/Shanghai&nullCatalogMeansCurrent=true" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">用户名</label>
                    <div class="layui-input-block">
                        <input type="text" name="userName" required  lay-verify="required" lay-affix="clear" placeholder="请输入用户名" value="root" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">密码</label>
                    <div class="layui-input-block">
                        <input type="password" name="userPwd" required  lay-verify="required" lay-affix="eye"  placeholder="请输入密码" value="123456" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="pear-btn pear-btn-md pear-btn-radius"  lay-submit lay-filter="formDemo">确定</button>
                        <button type="reset" class="pear-btn pear-btn-md  pear-btn-primary pear-btn-radius">取消</button>
                    </div>
                </div>
            </div>
        </div>
    </form>
    <th:block th:include="include :: footer"/>
    <script>
        let prefix = "/generate";
        layui.use('form', function(){
            const form = layui.form;
            form.on('submit(formDemo)', function(data){
                // layer.msg(JSON.stringify(data.field));
                $.ajax({
                    type: "POST",
                    url: prefix+"/connection",
                    async:false,
                    cache:false,
                    dataType: "json",
                    contentType: "application/json",  // 不加传递的为一个JSON
                    data: JSON.stringify(data.field),
                    success: function(res){
                        console.log(res)
                        if(res.success){
                            layer.msg(res.message,{icon:1,time:1000},function(){
                                parent.layer.close(parent.layer.getFrameIndex(window.name));//关闭当前页

                                // 向父窗口传递参数
                                parent.setDbNameList(res.data)
                                //parent.layui.table.reload("user-table");
                            });
                        }
                        else{
                            layer.msg(res.message,{icon: 2,time:3000});
                        }
                    },
                    error:function(e){
                        console.error(e)
                        layer.alert('错误：'+e);
                    }
                });
                return false;
            });
        });
    </script>
</body>
</html>